<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="author" content="m.jd.com">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css"
          href="/resources/wap/css/base2013.css" charset="gbk" />
    <link rel="stylesheet" type="text/css"
          href="/resources/wap/css/my.css?r=2" charset="gbk" />
    <link rel="stylesheet" type="text/css"
          href="/resources/wap/css/header.css" charset="gbk" />
    <link rel="stylesheet" type="text/css"
          href="/resources/wap/css/index.css" charset="gbk" />
    <link rel="stylesheet" type="text/css"
          href="/resources/wap/css/input.css" charset="gbk" />
    <link rel="stylesheet" href="/resources/wap/css/style.css">

    <script src="/resources/common/js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="/resources/common/js/md5.js"></script>
    <script type="text/javascript" src="/resources/js/Util.js"></script>
    <script type="text/javascript" src="/resources/js/ajaxfileupload.js"></script>
    <script type="text/javascript" src="/resources/js/self.js"></script>
    <style type="text/css">
        .padding_top{padding-top: 11px;}
        .orderStatistics{height:12.5px !important;}
        .img-div{
            text-align: center;
            background: url("/resources/wap/image/add_hi.png") no-repeat center;
            height: 200px;
        }

    </style>
    <title>Title</title>
</head>
<body>
<header>
    <!-- 通用头 div -->
    <div id="m_common_header" style="min-height: 45px; margin-top: 0px;">
        <header class="jd-header">
            <div class="jd-header-bar">
                <div id="m_common_header_goback" class="jd-header-icon-back J_ping"
                     onclick="javascript:window.location.href='/html/wap/customer/my.html';">
                    <span></span>
                </div>
                <div class="jd-header-title" style="max-width: 640px;margin: 0 auto">
                    个人中心
                </div>
            </div>
        </header>
    </div>
</header>
<a name="top"></a>
<div class="common-wrapper">

    <div class="myJD-content"  style="background-color: #fff;border-radius:15px;padding: 8px 10px;">
        <div class="product-title">
            <div class="img-div"
                  onclick="$('#fileUpload').click()">
                <img name="image"  height="160px" src=""/></div>
            <input style="display:none"  accept="image/*" type="file" value="" id="fileUpload" name="file"
                   onchange="uploadImage(this)">
            <div style="clear: both"></div>
        </div>
            <div >
                <div class="dlbox">
                    <label>姓名：</label>
                    <input name="name" class="customer" type="text">
                </div>
                <div class="dlbox">
                    <label>电话：</label>
                    <input name="telephone" class="customer" type="text" readonly>
                </div>
                <div class="dlbox">
                    <label>地址：</label>
                    <input name="address" class="customer" type="text">
                </div>

            </div>
            <div style="clear: both;">

            </div>
            <div align="center" style="margin-top: 30px;margin-bottom:30px;">
                <a style="background:#12B9DB;width: 200px;height: 40px;padding: 10px;border-radius: 5px;"
                   href="javascript:void(0)" onclick="save()">提交</a>
            </div>

        </div>

    </div>


</div>
</body>
<script type="text/javascript">
    $(function () {

        loadData();
    });
    function loadData() {
        $.ajax({
            url:"/wap/customer/getUser.do",
            data:{},
            type:'post',
            dataType:'json',
            success:function(data){
                console.log(data);
                if(data.success){
                    if(!isNullOrUndefined(data.data)){
                        var customer =  data.data;
                        $("[name='image']").attr("src",customer.headImage);
                        $("[name='name']").val(customer.name);
                        $("[name='telephone']").val(customer.telephone);
                        $("[name='address']").val(customer.address);
                    }

                }
            }
        });
    }
    function save() {
        var params = getPageDataByClass("customer");
        if (strIsNull(params['name'])) {
            alert("请输入名称");
            return;
        }
        if (strIsNull(params['address'])) {
            alert("请输入收货地址");
            return;
        }
        params['headImage'] = $("[name='image']").attr("src");
        $.ajax({
            url: "/wap/customer/update.do",
            data: params,
            dataType: 'json',
            type: 'post',
            success: function (data) {
                console.log(data);
                if (data.success) {
                    alert("保存成功");
                } else {
                    alert(data.msg);
                }
            }
        });
    }
    function uploadImage(node) {

        $.ajaxFileUpload({
            url: "/uploadImage.do?_t=" + new Date().getTime(),            //需要链接到服务器地址
            secureuri: false,//是否启用安全提交，默认为false
            fileElementId: $(node).attr("id"),                        //文件选择框的id属性
            dataType: 'json',                                     //服务器返回的格式，可以是json, xml
            success: function (data, status) {  //服务器成功响应处理函数
                if (data.success) {
                    var image = data.data;
                    $("[name='image']").attr("src",image);
                } else {
                    alert(data.msg);
                }
            },
            error: function (data, status, e) { //服务器响应失败处理函数

            }
        });
    }
</script>
</html>